Mermaid 语法

Mermaid 语法

Mermaid 是一种开源的可交互式的数据可视化库，它使用 Markdown 标记语言来生成图表和流程图。它通常用于生成网站或文档中的图表。Mermaid 不属于任何公司，而是一个由社区开发和维护的开源项目。 学习 Mermaid 的好方法是访问它的官方网站，其中包含了详细的文档和教程。 官方网站：​ ​<<https://mermaid-js.github.io/>​> 在线调试： Mermaidv10.9.0 Live Editor 在这里，你可以找到有关 Mermaid 的基础知识、语法和用例的信息。此外，你还可以在该网站的“Ex

cuman,OS

Pkmer

更多

Mermaid

Mermaid 流程图教程

关键字和方向，是最基本的。你得告诉 Mermaid，你要画的是个什么图，图的走向是什么？ 1. graph 2. flowchart flowchart 支持一些额外的效果，两者渲染后的样式，存在些微差异 1. - TB - top to bottom 自上而下 - TD - top-down 自上而下 2. BT - bottom to top 自下而上 3. LR - left to right 从左往右 4. RL - right to left 从右往左 - 只是推荐，不

成双酱

Pkmer

更多

流程图工具 Diagram

在 Obsidian 中使用 draw.io 编辑流程图和思维导图的介绍

在 Obsidian 中使用 draw.io 编辑流程图和思维导图非常简单。与使用 Mermaid 语法来生成流程图不同，使用 draw.io 可以直接通过图形编辑来创建和编辑流程图和思维导图。不需要学习和记忆复杂的语法规则，只需通过直观的拖拽和连接操作即可创建自己想要的图形。编辑完成后，可以将绘制的流程图和思维导图保存在 Obsidian 中一般文件 SVG 格式，可以随时查看和二次编辑。 同时 Draw.io 支持网页版及客户端使用，可以在 Windows、MacOS 和 Linux 系统上都进行操作。 关于 Diagram 软件的功能介绍

熊猫别熬夜

Pkmer

更多

mermaid 样式

Obsidian 样式 - 给 Mermai 添加横向滚动条

今天在 PKMer 交流群里面，有粉丝提到了 Mermaid。虽然 Obsidian 默认支持 Mermaid，并且对于一定大小的 Mermaid 会自动缩放。 但当你实际遇到大图，自动缩放尺寸又太小时，查看会变得不方便。于是乎就产生了这个诉求，能否给 Mermaid 块增加横向滚动条，在 Mermaid 图形较大时，可以横向拖动来查看。 image.png 这里我用简单的 css 实现下效果，但是书写水平有限，没有针对阅读视图处理，另外只粗浅测试了下 默认、minimal、blue topaz 三个主题。

OS

Pkmer

更多

Excalidraw脚本 Mermaid

Excalidraw 插入 Mermaid 后就不能对该 Mermaid 进行源码编辑，为此可以换个思路添加 Mermaid 图形，那就是将插入的 Mermaid 转为 SVG 格式，且 Ctrl + 鼠标左键单击 可以弹出源码进行二次编辑。

Excalidraw 插入 Mermaid 后就不能对该 Mermaid 进行源码编辑，为此可以换个思路添加 Mermaid 图形，那就是将插入的 Mermaid 转为 SVG 格式，且 Ctrl + 鼠标左键单击 可以弹出源码进行二次编辑。 Excalidraw 自定义脚本：插入可以编辑的 Mermaid 图形 javascript console.log("add mermaid") let { insertType, inputText } = await openEditPrompt(); if (!insertType) r

一鸣惊人,熊猫别熬夜

Pkmer

更多

GanttChart 项目进度

Mermaid, 甘特图, Gantt chart, 项目进度

Obsidian 社区存在很多任务管理相关插件，自己常用来实现任务管理的一些插件包括但不限于： - 该插件可以用来查询及列出满足特定条件的、不同状态的、可以嵌套层级的任务 - 该插件和 Dataview 能够实现的功能类似，只不过其对于诸如如下方面的支持较好： - 快速给出满足查询条件的任务 - 通过界面管理任务优先级、截止日期等属性 - 循环发生的任务 - 该插件是本人开发的，可以方便更改任务状态、添加时间戳等 - 该插件可以用可视化的看板视图展示任务、笔记等 - 该插件可以用来管理周期性笔记，比如，每日、每

Wen

Pkmer

更多

语法 时序图

Mermaid 语法，时序图

mermaid 可以渲染时序图。 可以像上面第一个示例中一样隐式定义参与者。参与者或角色的渲染由定义中出现的顺序决定。有时，您可能希望以与参与者在第一条消息中显示的顺序不同的顺序显示参与者。可以通过执行以下操作来指定角色的出现顺序： 如果你要使用角色符号而不是带有文本的矩形框表示参与者，则可以使用 actor 语句，如下所示： 角色可以以别名的形式定义一个方便输入的 id： 消息既可以实线，也可以虚线显示。 目前支持的箭头有 6 种： 类型描述 -- ->无箭头实线 -->无箭头虚线 ->>带

cuman

Pkmer

更多